{extend name="common/main"}

{block name="head"}

{include file="common/head_spec"}

{/block}

{block name="content"}

<link href="__STATIC__/home/css/login.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="__STATIC__/plugs/layui/layui.js"></script>
<link href="__STATIC__/plugs/layui/css/layui.css" rel="stylesheet"/>
<style type="text/css">
  input[type=password]{
    -webkit-appearance: none;
    -moz-appearance: none;
    margin: 0;
    padding: 0;
    background: 0 0;
    border: none;
  }
  
  .login_input{
    height:184px;
  }
  .login_input_font{
    padding-top:10px;
  }
  .login_btn{
    padding-top:5px;
  }
  .login_input ul li{
    height:45px;
  }
</style>

<div class="login_contentmain">
  <div class="logindiv">
    <form class="layui-form" action="" lay-filter="form">
    <div class="login" style="height: 415px;">
      <div class="login_title">注册</div>
      <div class="login_input">
        <ul>
          <li>
            <input name="username" lay-verify="username" type="text" placeholder="请输入帐号"/>
          </li>
          <li>
            <input name="password" lay-verify="password" type="password" placeholder="请输入密码"/>
          </li>
          <li>
            <input name="repassword" lay-verify="repassword" type="password" placeholder="请再次输入密码"/>
          </li>
          <li>
            <div class="rc_yzm">
              <input name="code" lay-verify="code" type="text" placeholder="验证码"/>
            </div>
            <div class="rc_btn">
              <!-- <input class="rc_input" name="" type="submit" value="获取验证码" /> -->
              <img class="rc_input" onclick="this.src+='?rand='+Math.random();" title="看不清？单击此处刷新" src='{:url("verify_code")}'>
            </div>
          </li>
        </ul>
      </div>
      <div class="login_input_font Tleft">
        <input name="agree" type="checkbox" lay-skin="primary" lay-verify="agree" />
        阅读并同意 <a href="{:url('home/help/detail', ['id' => 50])}" target="_blank">《用户协议》</a> 和 
        <a href="{:url('home/help/detail', ['id' => 49])}" target="_blank">《隐私政策》</a>
      </div>
      <div class="login_btn">
        <input type="submit" id="subtn" lay-submit="" lay-filter="sub" value="注册" />
      </div>
      <div class="login_input_font">有账号，马上<a href="{:url('home/login/index')}"><span>登录</span></a></div>
    </div>
    </form>
  </div>
</div>

{/block}

{block name="footer"}

{include file="common/footer_spec"}

{/block}

{block name="script"}
<script type="text/javascript">
layui.use(['layer', 'form'], function(){
  var layer = layui.layer
  ,form = layui.form;
  
  //自定义验证规则
  form.verify({
    username: function(value){
      if(value.length < 1){
        return '账号不能为空！';
      }
    }
    ,password: function(value){
      if(value.length < 1){
        return '密码不能为空！';
      }
    }
    ,repassword: function(value){
      if(value.length < 1){
        return '确认密码不能为空！';
      }
    }
    ,code: function(value){
      if(value.length < 1){
        return '验证码不能为空！';
      }
    }
    ,agree: function(value){
      // console.log(value);
      // console.log($("input[name='agree']").prop("checked"));
      // return false;
      if(!$("input[name='agree']").prop("checked")){
        return '请先阅读并同意用户协议与隐私政策！';
      }
    }
  });

    //监听提交
  form.on('submit(sub)', function(data){
      // console.log(data.field);
      // return false;
    $.post('/home/register/index', data.field, function(d){
      // console.log(d);
      // return false;
      if(d.status == 1){
        layer.msg(d.msg, {icon:1});
        window.location.href = d.url;
      }else{
        layer.msg(d.msg, {icon:5});
      }
    });
    return false;
  });
});
</script>

{/block}